var mapData=[
    {name: '北京',value: 359672 },
    {name: '天津',value: 0},
    {name: '上海',value: 0 },
    {name: '重庆',value: 0 },
    {name: '河北',value: 0},
    {name: '河南',value:0 },
    {name: '云南',value: 0 },
    {name: '辽宁',value: 0 },
    {name: '黑龙江',value: 0 },
    {name: '湖南',value: 0 },
    {name: '安徽',value: 0 },
    {name: '山东',value: 0 },
    {name: '新疆',value: 0},
    {name: '江苏',value: 0 },
    {name: '浙江',value: 0 },
    {name: '江西',value: 0 },
    {name: '湖北',value: 180700 },
    {name: '广西',value: 0 },
    {name: '甘肃',value: 0 },
    {name: '山西',value: 0 },
    {name: '内蒙古',value: 0 },
    {name: '陕西',value: 0 },
    {name: '吉林',value: 0 },
    {name: '福建',value: 0 },
    {name: '贵州',value: 0 },
    {name: '广东',value: 83 },
    {name: '青海',value: 0 },
    {name: '西藏',value: 0 },
    {name: '四川',value: 0 },
    {name: '宁夏',value: 0 },
    {name: '海南',value: 0 },
    {name: '台湾',value: 0 },
    {name: '香港',value: 0 },
    {name: '澳门',value: 0 }
]

var geoCoordMap = {}
var mapFeatures = echarts.getMap('china').geoJson.features;
mapFeatures.forEach(function(v) {
	// 地区名称
	var name = v.properties.name;
	// 地区经纬度
	geoCoordMap[name] = v.properties.cp;
});
var res = [];
for(var i = 0; i < mapData.length; i++) {
	var geoCoord = geoCoordMap[mapData[i].name];
	if(geoCoord) {
		res.push({
			name: mapData[i].name,
			value: geoCoord.concat(mapData[i].value),
			itemStyle: {
				areaColor: '#123082'
			}
		});
	}
}
mapData = res
var mapOption = {
	geo3D: {
		show: false,
		map: 'china',
	},
	tooltip: {
		show: true,
		trigger: 'item',
		formatter: (params) => {
			return '<div>' + params.name + ' : ' + params.value[2] + '</div>'
		}
	},
	series: [{
			type: "map3D",
			map: 'china',
			z: 1,
			zlevel: 1,
			name: 'ChinaMap',
			itemStyle: {
				areaColor: "#123082",
				opacity: 1,
				borderWidth: 0.4,
				borderColor: '#285ac6',
			},
			label: {
				show: true,
				distance: 10,
				textStyle: {
					backgroundColor: 'transparent',
					color: '#fff', //地图初始化区域字体颜色
					fontSize: 12,
					opacity: 1,
					borderWidth: 0
				},
			},
			emphasis: { //当鼠标放上去  地区区域是否显示名称
				label: {
					show: true,
					textStyle: {
						backgroundColor: 'transparent',
						color: '#fff',
						fontSize: 12
					}
				},
				itemStyle: {
					areaColor: '#2a56bd',
					borderColor: '#2a56bd'
				}
			},
			shading: 'lambert',
			light: { //光照阴影
				main: {
					color: '#fff', //光照颜色
					intensity: 1.2, //光照强度
					shadowQuality: 'high', //阴影亮度
					shadow: true, //是否显示阴影
					alpha: 55,
					beta: 10

				},
				ambient: {
					intensity: 0.3
				}
			},
			data: mapData
		},
		{
			type: 'bar3D',
			coordinateSystem: 'geo3D',
			shading: 'lambert',
			zlevel: 2,
			data: mapData,
			barSize: 0.7,
			minHeight: 0.2,
			silent: true,
			itemStyle: {
				color: 'orange'
			},
			light: { //光照阴影
				main: {
					color: '#fff', //光照颜色
					intensity: 1.2, //光照强度
					shadowQuality: 'high', //阴影亮度
					shadow: true, //是否显示阴影
					alpha: 55,
					beta: 10

				},
				ambient: {
					intensity: 0.3
				}
			}
		}
	]
};

var mapChart = echarts.init(document.getElementById('APPChina'))
mapChart.setOption(mapOption)

var count = 0;
var timer = null;

function cityShow() {
	for(var i = 0; i < mapData.length; i++) {
		mapOption.series[0].data[i].itemStyle.areaColor = '#123082'
	}
	mapOption.series[0].data[count % mapData.length].itemStyle.areaColor = '#2a56bd'
	mapChart.setOption(mapOption)
	
	$("#ranklistRight3 .tab_content").html("")
	$("#ranklistRight3 .tab_content").append("<tr>"+
    "<td>"+mapData[count% mapData.length].name+"</td>"+
    "<td>"+mapData[count% mapData.length].value[2]+"</td>"+
	"</tr>")
	
	count++
//	console.log(mapData[count % mapData.length],'------')
}
cityShow()
timer = setInterval(cityShow, 1000)

mapChart.on('mouseover', function(param) {
	$("#ranklistRight3 .tab_content").html("")
	$("#ranklistRight3 .tab_content").append("<tr>"+
    "<td>"+param.name+"</td>"+
    "<td>"+param.value[2]+"</td>"+
	"</tr>")
	clearInterval(timer)
})
/*mapChart.on('mouseout', function(param) {
	clearInterval(timer)
	timer = setInterval(cityShow, 1000)
})*/
mapChart.on('globalout', function(param) {
	clearInterval(timer)
	timer = setInterval(cityShow, 1000)
})


